/**
 * Created by yangfakuan  on 2018/10/24.
 */
//封装弹窗
function DialogHandler() {

    var bind = new BindEvent(); //绑定事件 | BIND
    this.DATA_TYPE = {  //登窗类型 | ENUMERATION
        PHONE_SECURITY_RISK: "手机身份验证",
        EMAIL_BIND: "绑定新邮件地址",
        PHONE_BIND: "绑定新手机号",
        EMAIL_VALIDATE: "邮箱身份验证"

    };

    //登录框 | MAIN
    this.handler = function (type) {

        var title = type;
        var validate;
        var html;

        if (type === '手机身份验证') {
            html = new PhoneValidateHtml().handler();
            validate = new PhoneValidateEvent();
        }

        if (type === '绑定新邮件地址') {
            html = new EmailBindHtml().handler();
            validate = new EmailBindEvent();
        }

        if(type === '绑定新手机号') {
            html = new PhoneBindHtml().handler();
            validate = new PhoneBindEvent();
        }

        if(type === '邮箱身份验证') {

        }


       var htmlService =  new DialogHtmlService();
        htmlService.handler(html, validate, title);

    };

    //提示性弹窗 | FUN
    this.dialogConfirm = function () {

        var dialog = new DialogConfirmHtml();
        dialog.handler();
    };

    //手机验证 | HTML
    function  PhoneValidateHtml () {
        var _that = this;
        var html;

        _that.handler = function () {
            html = '<div>';
            html += '<p class="inptips2">为确认是您本人操作，请进行身份验证。</p>';
            html += '<div style="width:100%;height:16px;"></div>';
            html += '<div class="line-EMUI5" style="margin-bottom:8px;">';
            html += '<div id="accountDiv">159****9184</div>';
            html += '</div>';
            html += '<div class="dinput-UI5 authCodeDivCom" id="authCodeDiv">';
            html += '<div id="getAuthCodeBtn" class="getAuthbtn" intervaltime="60">';
            html += '<a class="a-EMUI5 getAuthText">获取验证码</a>';
            html += '<div id="authCodeError" class="left"></div>';
            html += '</div>';
            html += '<div id="authCodeInput" class="input-div  clearfloat">';
            html += '<input type="tel" id="oldAuthCode" validator="validator41540340381726" placeholder="短信验证码">';
            html += '<p id="oldAuthCode_error_info"></p>';
            html += '</div>';
            html += '</div>';
            html += '<div id="msg_error_auth" class="error-tips-EMUI5 " style=""></div>';
            html += '<div class="center marginT16">';
            html += '<div class="appealChangeLink_div center" style="">';
            html += '<div class="cantReciveTips">手机号无法使用？';
            html += '<a target="_blank" class="representation_link a-EMUI5" href="#">帐号申诉</a>';
            html += '</div>';
            html += '</div>';
            html += '</div>';
            html += '</div>';

            return html;
        };

    }

    //手机验证事件 | EVENT
    function PhoneValidateEvent () {

        var _that = this;

        //绑定事件 | MAIN
        _that.handler = function () {

            bind.handler("oldAuthCode", "input",  oldAuthCodeEvent);
            bind.handler("getAuthCodeBtn", "click", getAuthCodeBtnEvent);
            bind.handler("rightBtnText", "click",  rightBtnTextEvent);

        };

        //验证码输入事件 | EVENT
        function oldAuthCodeEvent (){

            var btn = bind.handler("rightBtn_confirm");

            var code = $(this);

            if (!( code.val() === '' )) {

                btn.removeClass("globle_dialog_btn_disabled");
                btn.removeAttr("disabled");
                btn.css("cursor", "pointer");

            } else {

                btn.addClass("globle_dialog_btn_disabled");
                btn.attr("disabled", "disabled");
                btn.css("cursor", "auto");
            }
        }

        //“获取验证码”事件 | EVENT
        function getAuthCodeBtnEvent () {
            var _that = $(this);
            var _interface = 'getSMSAuthCode.php';
            var type = 'POST';
            var data = {};

            var beforeSend = function () {
                var c = 60;
                var CountDown = new CountDown(_that,c);
                CountDown.down();
            };

            var success = function (data) {
                console.log(data);
            };

            var error = function () {

            };

            var complete = function () {


            };

            var ajax = new AjaxHandler(_interface, type, data);
            ajax.handler(beforeSend, success, error, complete);
        }

        //确定按钮事件 | EVENT
        function rightBtnTextEvent () {

            var _interface = 'form.php';
            var type = 'POST';
            var data = {};

            function beforeSend() {
            }

            function success (data) {
            }

            function error () {

            }

            function complete () {

            }

            ajaxService(_interface, type, data,beforeSend, success, error, complete);
        }



    }

    //手机绑定 | HTML
    function PhoneBindHtml() {

        var _that = this;
        var html;

        _that.handler = function () {
            html = '<div>';
            html += '<div id="oldAccObj">';
            html +=    '<div id="bindPhoneDialog">';
            html +=    '<div class="dinput-UI5   userAccountDiv" id="phoneInputDiv-box" style="margin-bottom:0px">';
            html +=    '<div class="l inputLeft">';
            html +=   '<div id="input_languageCode" class="ddrop-EMU5"><input type="hidden" value="0086">';
            html += '<span class="select-text ar-eg">+86(中国)</span>';
            html += '<span class="suffix" style="color: rgb(51, 51, 51);"></span>';
            html +=    '<div class="select-ico select-ico-gray"></div>';
            html +=    '<ul class="dpmenu-EMU5 dpmenu-EMUI5-down" style="display: none; width: 136px;">';
            html +=    '<div class="flow-top"></div>';
            html +=    '<li class="dropListEMUI5_li ar-eg" data-value="0086">+86(中国)</li>';
            html +=    '</ul>';
            html +=    '</div>';
            html +=    '</div>';
            html +=    '<div class="input-div" id="newUserAccDiv"><input class="input-number" type="tel" id="newUserAccount" name="phone" maxlength="20" placeholder="手机号" validator="validator11540538454457"></div>';
            html +=    '</div>';
            html +=    '<div id="phone_error_info" class="error-tips-EMUI5" style="margin-bottom:14px"></div>';
            html +=    '<div class="dinput-UI5 authCodeDiv" id="inputAuthCode" style="margin-bottom:0px">';
            html +=    '<div class="getAuthbtn" act="getVerificationCode" id="getPhoneAuthCodeBtn" intervaltime="60">';
            html += '<span class="getAuthText">获取验证码</span>';
            html +=    '<div id="authCodeError"></div>';
            html +=    '</div>';
            html +=    '<div class="input-div"><input maxlength="8" id="newAuthCode" type="text" placeholder="短信验证码"  validator="validator21540538454458"></div>';
            html +=    '</div>';
            html +=    '<div class="error-tips-EMUI5" id="new_auth_error_tip"></div>';
            html +=    '<div class="relative">';
            html +=    '<div class="pop hidden"><b class="uptick"></b>';
            html +=    '<p class="poptips">错误信息</p></div>';
            html +=    '</div>';
            html +=    '</div>';
            html +=   '</div>';
            html +=    '</div>';

            return html;
        }

    }

    //手机绑定事件 | EVENT
    function PhoneBindEvent() {

        var _that = this;

        //绑定事件 | MAIN
        _that.handler = function () { };


    }

    //邮箱绑定 | HTML
    function EmailBindHtml () {

        var _that = this;
        var html;

        _that.handler = function (){
            html = '<div>';
            html += '<div id="oldAccObj">';
            html +=    '<div id="bindEmailDialog">';
            html +=    '<div id="newEmailDiv" class="dinput-UI5" style="margin-bottom:0px">';
            html +=    '<input id="newEmailAccount" maxlength="50" type="text" placeholder="邮件地址" validator="validator71540544290200"></div>';
            html +=    '<p class="error-tips-EMUI5" id="email_error_info" style="margin-bottom:14px"></p>';
            html +=    '<div class="dinput-UI5 authCodeDiv" id="inputAuthCode" style="margin-bottom:0px">';
            html +=    '<div class="getAuthbtn" act="getVerificationCode" id="getEmailAuthCodeBtn" intervaltime="60">';
            html +=    '<span class="getAuthText">获取验证码</span>';
            html +=    '<div id="authCodeError"></div>';
            html +=    '</div>';
            html +=    '<div class="input-div"><input maxlength="8" id="newAuthCode" type="text" placeholder="邮件验证码"  validator="validator81540544290201"></div>';
            html +=    '</div>';
            html +=    '<div class="error-tips-EMUI5" id="new_auth_error_tip"></div>';
            html +=    '<div class="relative">';
            html +=    '<div class="pop hidden"><b class="uptick"></b>';
            html +=    '<p class="poptips">错误信息</p></div>';
            html +=    '</div>';
            html +=    '</div>';
            html +=    '</div>';
            html +=    '</div>';

            return html;
        }
    }

    //邮箱绑定事件 | EVENT
    function EmailBindEvent () {

        var _that = this;

        //绑定事件 | MAIN
        _that.handler = function () {
            //$("#oldAuthCode").on("input", oldAuthCodeEvent);
        };

        //function event(){};
    }

    //邮箱身份验证

    //提示性弹窗 | HTML
    function DialogConfirmHtml () {

        var _that = this;
        var html;

        _that.handler = function () {
            html = '<div class="global_dialog_confirm_main">';
            html +=    '<div class="textArea center">';
            html +=    '<div class="dcent">'
            html +=    '<div class="center" style="margin-bottom:10px">';
            html +=    '<img src="../assets/user-center/images/email-suc.png">';
            html +=    '<p class="inptips2">该邮箱可用于登录、重置密码和验证身份</p></div>';
            html += '</div>';
            html += '</div>';
            html += '<div class="btn-area" style="width:42%;margin:auto">';
            html +=    '<a class="btn-EMUI5-2" id="rightBtn" href="javascript:void(0)">关闭</a>';
            html +=    '</div>';
            html +=    '</div>';
            html +=    '<div class="global_black_overlay"></div>';

            $('body').append(html);
        }
    }

    //公共事件处理 | EVENT
    function CommonEvent () {

        var _that = this;

        _that.handler = function () {

            $("#dialog_cancel_btn").on("click", dialogCancelBtnEvents);
            $("#dialog_leftBtn").on("click", dialogLeftBtnEvents);

        };

        //关闭弹窗
        function dialogCancelBtnEvents () {

            $(".global_dialog_confirm_main").remove();
            $(".global_black_overlay").remove();

        };

        //取消按钮
        function dialogLeftBtnEvents () {

            $(".global_dialog_confirm_main").remove();
            $(".global_black_overlay").remove();

        };
    };

    //弹窗 | HTML_SERVICE
    function DialogHtmlService() {

        var _that = this;

        _that.handler = function (html,validate ,dialog_title) {

            var dialog;

            dialog = new HeaderHtml().handler(dialog_title);
            dialog += html;
            dialog += new FootHtml().handler();
            $('body').append(dialog);

            new CommonEvent().handler();
            validate.handler();  //表单事件
        };

    }

    //头部HTML | HTML
    function HeaderHtml () {

        var _that = this;

        _that.handler = function (dialog_title) {

            var html;

            html = '<div class="global_dialog_confirm_main" style="display:block; overflow-y: visible; bottom: auto; top: 80px;">';
            html += '<div class="global_dialog_confirm_title">';
            html += '<h3 class="ellipsis" id="dialog_title" title="' + dialog_title + '">' + dialog_title + '</h3>';
            html += '</div>';
            html += '<div class="global_dialog_confirm_content" style="overflow-y: visible; height: auto;">';

            return html;
        };

    }

    //底部HTML | HTML
    function FootHtml () {

        var _that = this;
        var html;

        _that.handler = function (dialog) {
            html = '</div>';
            html += '<div class="global_dialog_confirm_ft">';
            html += '<div class="dialog-left-btn-wrap l" id="dialog_leftBtn">';
            html += '<div class="global_dialog_confirm_nor" role="cancel" title="取消"><span>取消</span></div>';
            html += '</div>';

            html += '<div class="dialog-right-btn-wrap r" id="dialog_rightBtn">';
            html += '<div class="global_dialog_confirm_nor globle_dialog_btn_disabled" role="confirm" id="rightBtn_confirm" title="确定" disabled="disabled" style="cursor: auto;">';
            html += '<span id="rightBtnText">确定</span>';
            html += '<div class="errortip"></div>';
            html += '</div>';
            html += '</div>';
            html += '</div>';

            html += '<div class="dialog-cancel" role="cancel2" id="dialog_cancel_btn"></div>';
            html += '</div>';
            html += '<div class="global_black_overlay"></div>';

            return html;
        };


    }
}

